<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>认证证书</title>
    <link rel="stylesheet" href="${siteurl}/statics/element-ui/element-ui.css">
    <style>
        body{
            background: linear-gradient(#c7c8cf,#e8e8e9,#c7c8cf);
        }
        a {
            color: #0c3877;
            text-decoration: none;
        }

        .user-info, .comment-main {
            float: left;
            font-size: 13px;
        }

        .user-info {
            width: 120px;
            text-align: center;
        }

        .user-head, .user-name, .user-tag {
            width: 82px;
            margin-bottom: 10px;
        }

        .user-head {
            height: 82px;
            border: 1px solid #ddd;
            padding: 3px;
            border-radius: 2px;
        }

        .user-head > img {
            width: 80px;
            height: 80px;
        }

        .comment-main {
            width: calc(100% - 120px);
        }

        .comment-body {
            min-height: 110px;
            padding: 10px;
        }

        .comment-info {
            position: relative;
            float: right;
            margin: 10px;
        }

        .box-card {
            margin-bottom: 10px;
        }
    </style>
    <script>
        window.siteUrl = '${siteurl}';
    </script>
</head>
<body>
<div class="animated fadeInUp" id="v-main" v-cloak>
    <el-main v-loading="loading">
        <el-card class="box-card" style="margin-top: 15%;width: 50%;margin-left: 25%;margin-right: 50%;">
            <el-steps :active="active" align-center finish-status="success">
                <el-step title="步骤 1" description="获取本机机器码"></el-step>
                <el-step title="步骤 2" description="获取证书文件和密钥"></el-step>
                <el-step title="步骤 3" description="安装证书文件"></el-step>
            </el-steps>

            <el-row type="flex" justify="space-around">
                <el-col :span="2">
                    <el-button v-if="firstShow" style="margin-top: 12px;" @click="next">下一步</el-button>
                </el-col>
                <el-col :span="2">
                    <el-button v-if="secondShow" style="margin-top: 12px;" @click="next">下一步</el-button>
                </el-col>
                <el-col :span="2">
                    <el-button type="success" v-if="thirdShow" style="margin-top: 12px;" @click="next">已完成</el-button>
                </el-col>
            </el-row>

            <el-row type="flex" justify="center" style="border-radius: 4px">
                <!--获取本机机器码-->
                <el-col :span="18" v-if="firstPanel">
                    <el-button type="primary" style="margin-top: 18px" @click="getMachineCode">获取机器码</el-button>
                    <el-tag v-if="machineCodeShow" style="margin-top: 18px" type="warning">温馨提示：请将该机器码发送给部署人员。</el-tag>
                    <el-input
                            style="margin-top: 12px"
                            v-if="machineCodeShow"
                            type="textarea"
                            :autosize="{minRows: 4, maxRows: 38}"
                            placeholder="机器码"
                            v-model="license.machineCode">
                    </el-input>
                </el-col>

                <!--获取证书文件和密钥-->
                <el-col :span="18" v-if="secondPanel">
                    <el-tag style="margin-top: 18px">请将第一步的机器码发送给部署人员，将获得到的证书文件和公钥文件保存到本地电脑，在第三步完成上传操作！</el-tag>
                </el-col>

                <!--安装证书文件-->
                <el-col :span="18" v-if="thirdPanel">
                    <el-upload
                            class="upload-demo"
                            style="margin-top: 10px;"
                            ref="upload"
                            action="${siteurl}/license/uploadLicense"
                            :on-preview="handlePreview"
                            :on-remove="handleRemove"
                            :on-success="onSuccess"
                            :show-file-list="false">
                        <el-button style="margin-top: 10px;" slot="trigger" size="small" type="primary">选取文件</el-button>
                        <el-button style="margin-left: 10px;" size="small" type="success" @click="installCertificate">安装证书</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传lic文件，且不超过500kb</div>
                    </el-upload>
                </el-col>

            </el-row>

        </el-card>
    </el-main>

</div>

<!--promise方式处理请求-->
<script src="${siteurl}/statics/axios/axios.min.js"></script>
<script src="${siteurl}/statics/js/aes.js"></script>
<script src="${siteurl}/statics/js/utils.js"></script>
<script type="text/javascript" src="${siteurl}/statics/js/encrypt/core.js"></script>
<script type="text/javascript" src="${siteurl}/statics/js/encrypt/md5.js"></script>
<script type="text/javascript" src="${siteurl}/statics/js/encrypt/tripledes.js"></script>
<script type="text/javascript" src="${siteurl}/statics/js/encrypt/mode-ecb.js"></script>
<script src="${siteurl}/statics/vue/vue.min.js"></script>
<script src="${siteurl}/statics/element-ui/element-ui.js"></script>
<script type="text/javascript"
        src="${siteurl}/statics/js/ceritification.js"></script>
</body>
</html>